<%=render_partial 'header', "What career do you want?"%>
<%= javascript_include_tag :defaults %>
<script type="text/javascript">
var count = 0;
function addTextBox() {
    count+=1;
    var all_companies = document.getElementById('new_companies');
    var newdiv = document.createElement('div');
    var divIdName = "new_company"+count;
    newdiv.setAttribute('id',divIdName);
    newdiv.setAttribute('class',"new_company");
    newdiv.setAttribute('style',"{display:none}");
    newdiv.innerHTML = "<input type=text id=company["+count+"] name=company["+count+"] size=30 />"
    removeBottomRound();
    all_companies.appendChild(newdiv);
    new Effect.SlideDown("new_company"+count, { queue:'end'});
    addBottomRound();
}
function removeBottomRound() {
    var all_companies = document.getElementById('new_companies');
    var bottom_round = document.getElementById('bottom_round');
    all_companies.removeChild(bottom_round);
}

function addBottomRound() {
    var all_companies = document.getElementById('new_companies');
    var newdiv = document.createElement('div'); 
    newdiv.setAttribute('id','bottom_round');
    newdiv.innerHTML = "<input type=submit />";
    all_companies.appendChild(newdiv);
}
</script>

<form name="collector" action="collect" method="post">
    	<div id="container" class="container"
    	<div id="left" class="left">
    	What Job Are You Looking For?<br />
    	<div id="job_entry">
    	   <input type="text" id="job" name="job" size="30" />
    	</div>
    	</div>
    	
    	<div id="right" class="right">
    	What Companies Are You Considering?<br />
        <div id="new_companies">
            <div id="new_company0" class="new_company">
                <input type="text" id="company[0]" name="company[0]" size="26"/>&nbsp<span onclick="addTextBox()">[+]</span>
            </div>
            <div id="bottom_round">
    	           <input type="submit" />
            </div>
        </div>  
        </div>      
        </div>
</form>